<template>
    <div id="app">
        <div class="fixed-wrapper" :class="{'active':showCartSlider}">
            <cart-slider :showCartSlider="showCartSlider"></cart-slider>
            <keep-alive>
                <v-header></v-header>
            </keep-alive>
            <div class="warpper translateX">
                <router-view></router-view>
                <keep-alive>
                    <v-footer></v-footer>
                </keep-alive>
            </div>
        </div>
    </div>
</template>
<script>
import CartSlider from './components/Cart/Slider'
import Header from './components/common/Header'
import Footer from './components/common/Footer'
export default {
    name: 'app',
    data() {
        return {
            showCartSlider: false
        }
    },
    components: {
        'v-header': Header,
        'v-footer': Footer,
        CartSlider
    }
}
</script>